@(message: String)
@main2(message) {
    <div class="row">
        <div class="col-md-6">
            <div class="portlet light ">
                <div class="portlet-title">
                    <div class="caption">
                        <i class="icon-bubble font-green-sharp"></i>
                        <span class="caption-subject font-green-sharp bold uppercase">Loading with AJAX</span>
                    </div>
                </div>
                <div class="portlet-body">
                        <!-- data-ride="carousel"属性用于标记轮播在页面加载时就开始动画播放 -->
                    <div id="myCarousel" class="carousel slide" >
                            <!-- 轮播（Carousel）指标 -->
                        <ol class="carousel-indicators">
                            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                            <li data-target="#myCarousel" data-slide-to="1"></li>
                            <li data-target="#myCarousel" data-slide-to="2"></li>
                        </ol>
                            <!-- 轮播（Carousel）项目 -->
                        <div class="carousel-inner">
                            <div class="item active">
                                <a href="https://www.baidu.com">@*为图片添加链接*@
                                    <img src="/main2/img/bootstrap_slid/slide1.png" alt="First slide">
                                </a>
                                <div class="carousel-caption">标题 1</div>
                            </div>
                            <div class="item">
                                <img src="/main2/img/bootstrap_slid/slide2.png" alt="Second slide">
                                <div class="carousel-caption">标题 2</div>
                            </div>
                            <div class="item">
                                <img src="/main2/img/bootstrap_slid/slide3.png" alt="Third slide">
                                <div class="carousel-caption">标题 3</div>
                            </div>
                        </div>
                            <!-- 轮播（Carousel）导航 -->
                        <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>@*  &lsaquo左箭头 *@
                        <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>@* &rsaquo右箭头 *@
                    </div>
                        <!-- 控制按钮 -->
                    <div style="text-align:center;">
                        <input type="button" class="btn start-slide" value="Start">
                        <input type="button" class="btn pause-slide" value="Pause">
                        <input type="button" class="btn next-slide" value="Next">
                        <input type="button" class="btn slide-one" value="Slide1">
                        <input type="button" class="btn slide-two" value="Slide2">
                        <input type="button" class="btn slide-three" value="Slide3">
                        <input type="button" class="btn prev-slide" value="Previous">
                        <input type="button" class="btn slide-time" value="间隔">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
            $(function(){
                //当调用 slide 实例方法时立即触发该事件
               /* $('#myCarousel').on('slid.bs.carousel', function () {
                    alert("图片滑动了");
                });*/
                // 初始化轮播
                $(".start-slide").click(function(){
                    $("#myCarousel").carousel('cycle');
                });
                // 停止轮播
                $(".pause-slide").click(function(){
                    $("#myCarousel").carousel('pause');
                });
                // 循环轮播到上一个项目(帧)
                $(".prev-slide").click(function(){
                    $("#myCarousel").carousel('prev');
                });
                // 循环轮播到下一个项目(帧)
                $(".next-slide").click(function(){
                    $("#myCarousel").carousel('next');
                });
                // 循环轮播到某个特定的帧
                $(".slide-one").click(function(){
                    $("#myCarousel").carousel(0);
                });
                $(".slide-two").click(function(){
                    $("#myCarousel").carousel(1);
                });
                $(".slide-three").click(function(){
                    $("#myCarousel").carousel(2);
                });
                $(".slide-time").click(function(){
                    $("#myCarousel").carousel({
                        interval: 1000
                    });
                });
            });
    </script>

}


